import React, { useMemo } from "react";

const VoteMain = function VoteMain(props) {
  const { supNum, oppNum } = props;
  const ratio = useMemo(() => {
    let total = supNum + oppNum,
      ratio = "----";
    if (total > 0) ratio = ((supNum / total) * 100).toFixed(2) + "%";
    return ratio;
  }, [supNum, oppNum]);

  return (
    <div className="main">
      <p>支持人数：{supNum}人</p>
      <p>反对人数：{oppNum}人</p>
      <p>支持率：{ratio}</p>
    </div>
  );
};

export default VoteMain;
